<template>
  <div id="app">
    <van-nav-bar
      v-if="$store.getters.getistab"
      :title="$store.getters.gettitle"
      left-text="返回"
      @click-left="fn"
      :left-arrow="$store.state.isleft"
    />
    <router-view />
    <van-tabbar v-if="$store.state.istabbottom" v-model="active">
      <van-tabbar-item to="/" name="home">
        <svg-icon class="icon" iconClass="书本2"></svg-icon>
        <div class="box">Bookstore</div>
      </van-tabbar-item>
      <van-tabbar-item to="/" name="search">
        <svg-icon class="icon icon2" iconClass="羽毛笔"></svg-icon>
        <div class="box">Book</div>
      </van-tabbar-item>
      <van-tabbar-item to="/user" name="user">
        <svg-icon class="icon icon2" replace iconClass="用户"></svg-icon>
        <div class="box">user</div>
      </van-tabbar-item>
    </van-tabbar>
  </div>
</template>
<script>
export default {
  data() {
    return {
      active: "",
    };
  },
  methods: {
    fn() {
      this.$router.back();
    },
  },
};
</script>

<style lang="scss">
.icon {
  font-size: 0.8rem;
  margin-left: 0.4rem;
  margin-bottom: 0.1rem;
}
.box {
  text-align: center;
}
.icon2 {
  margin-left: 0.08rem;
}
</style>